<html>
    <head>
        <title>Linq4DB Test</title>
        <style>
            li {
                padding: 0.2em 1em;
            }
            
            #console {
            	clear:both;
                margin: 1em 0 1em 0;
                padding: 0.5em;
				height : 50%;
				overflow-y : scroll;
                border: SOLID 1px GRAY;
            }
            
            #console div {
                padding: 0.2em;
                font-size: 0.8em;
                color: #333333;
            }
			
			#code{
				font-family : courier;
				font-size : 1.5em;
				margin : 1em;
			}
        </style>
    </head>
    <body>
        <ol id = "examples">
        </ol>
        <div id = "code">
        	{{ LINQ Code will be show here }}
        </div>
		<a href = "javascript:clear()" style = "clear:both; display: block; ">Clear Console</a>
        <div id = "console">
        </div>
        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js" type="text/javascript">
        </script>
        <script src= "linq4idb.js" type="text/javascript">
        </script>
        <script charset="utf-8">
        	function clear(){
				$("#console").empty();	
			}
			
            function data(){
                return {
                    "bookName": "bookName-" + parseInt(Math.random() * 100),
                    "price": parseInt(Math.random() * 1000),
                    "checkedOut": new Date()
                }
            };
            
            function showRecords(record){
                $("#console").append($("<div>").html(JSON.stringify(record)));
                //console.info.apply(this, arguments);
            }
            
            var examples = {
                "To ObjectStore, Add Data": function(){
                    linq4idb().to("BookList")["in"]("LibraryDB").add(data()).done(showRecords);
                },
                "From ObjectStore Select and print each": function(){
                    linq4idb().from("BookList")["in"]("LibraryDB").select().forEach(showRecords);
                },
                "From ObjectStore, Order By Price and Print All": function(){
                    linq4idb().from("BookList")["in"]("LibraryDB").orderby("price").select().forEach(showRecords);
                },
                "From ObjectStore, Order By Price REVERSED and Print All": function(){
                    linq4idb().from("BookList")["in"]("LibraryDB").orderby("price", 1).select().forEach(showRecords);
                },
                
                "From ObjectStore, Where property Equals": function(){
                    linq4idb().from("BookList")["in"]("LibraryDB").where("price", {
                        "equals": 450
                    }).select().forEach(showRecords)
                },
                "From ObjectStore, Where property in Range": function(){
                    linq4idb().from("BookList")["in"]("LibraryDB").where("price", {
                        "range": [200, 450]
                    }).select().forEach(showRecords)
                },
                
                "From ObjectStore, Where property in Range and Ordered": function(){
                    linq4idb().from("BookList")["in"]("LibraryDB").where("price", {
                        "range": [200, 450]
                    }).orderByDesc().select().forEach(showRecords)
                },
                
                
                "Remove ObjectStore in Database": function(){
                    linq4idb().remove("BookList")["in"]("LibraryDB").done(showRecords);
                }
            }
            
            for (example in examples) {
                $("#examples").append($("<li><a class = 'command' href = 'javascript:examples[\"" + example + "\"]()'>" + example + "</a></li>"));
            }
            
            $(".command").live("click", function(){
                var code = examples[$(this).html()].toString();
                var start = "function (){";
                code = code.substring(code.indexOf(start) + start.length + 2, code.length - 1);
                $("#code").html(code);
            });
        </script>
    </body>
</html>
